<!DOCTYPE html>
<html lang="en" style="height: 100%;">

<head>
	<meta charset="UTF-8">
	<meta name="viewport"
		content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
	<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
	<title>手机快速注册</title>
	<link rel="stylesheet" type="text/css" href="../../css/api.css" />
	<link rel="stylesheet" type="text/css" href="../../css/style.css" />
	<link rel="stylesheet" type="text/css" href="../../css/yzl.css" />
	<style>
		.input-center {
			margin: 0 auto;
			/*height: 60px;*/
			width: 100%;
			line-height: 50px;
		}

		input {
			/*line-height: 60px;*/
			outline: none;
			border-radius: 5px;
		}


		.register-btn {
			background: #33375E;
		}

		.input-center input {
			border: none;
		}

		.aui-checkbox {
			width: 16px;
			height: 16px;
			vertical-align: middle;
		}

		.v-enter,
		.v-leave-to {
			opacity: 0;
		}

		.v-enter-active,
		.v-leave-active {
			transition: opacity 1.5s;

		}
		.saoma{
			position: absolute;
			width:84px;
			height: 30px;
			/*margin-top: -25px;*/
			top:8px;
			text-align: center;
			line-height: 30px;
			color: #F95656;
			border-radius:  15px;
			border:1px solid #F95656;
			font-size: 12px;
			right:0px
		}
	</style>
</head>

<body style="background:#ffffff">
	<div id="blank" class="header" v-cloak>
		<div v-back.tapmode class="back"></div>
		<div class="title">注册</div>
	</div>
	<div id="app" v-cloak >
		<div style="width:100%;padding: 0 5%;padding-top:80px;box-sizing: border-box;">
			<div class="regis-head">
				<div  class="regis-head-xinxi">
					<div >手机号注册</div>
				</div>
			</div>
			<div class="input-center input-text" style="border-bottom:1px solid #F7F4F2;">
				<!-- <span class="warn-title-right" v-show="warn_box">{{warn_title1}} <span style="color: #4040FD"	v-myclick="pwdlogin">{{warn_title3}}</span> </span> -->
				<input class="input"  placeholder="请输入手机号" type="tel" v-model="phone"  required maxlength="11" />
			</div>
			<div class="input-center input-text" >
				<input class="input" type="tel"  maxlength="6" placeholder="请输入短信验证码"  v-model="verify_code" />
				<sendcode :phone="phone" type="8" :stamp="stamp" style="position:absolute;right:0px;top:2.2rem">
				</sendcode>
			</div>
			<div class="input-center" >
				<input class="input" type="text" v-model="invite_code"  ref="text" placeholder="请输入邀请码"   required />
				<a  class="saoma" v-myclick="scanner"><img v-src="'../../image/saoma.png'" style="width:12px;vertical-align:middle;margin-right:3px">扫码获取</a>
			</div>
			<div class="user-agreement">注册代表同意<a style="color:#28A5DF">用户协议、隐私政策</a></div>
			<div v-myclick="registerPhone" class="regrist-button" :class="{'regrist-button-active':phone&verify_code&invite_code}">同意协议并注册</div>
			<div v-myclick="tologin" class="regrist-button-two">已有账号,去登录</div>
		</div>
	</div>
</body>
	<script src="../../script/api.js"></script>
	<script src="../../script/vue.js"></script>
	<script src="../../script/app.js"></script>
	<script src="../../script/common.js"></script>
	<script src="../../script/url.js"></script>
	<script src="../../script/components.js"></script>

	<script>

		var pageParam,
				phone,
				vm;
		var talkingData;
		apiready = function () {
			setBSImg();
			new Vue({
				el: '#blank',
			});
			wap_url = getPrefs("wap_url");
			talkingData = api.require('talkingData');
			pageParam = api.pageParam;
			initApp();
			api.parseTapmode();
			addListeners();
		};

		function initApp() {
			var isBigImg = Vue.BSImg == 'big';
			vm = new Vue({
				el: '#app',
				data: {
					authinfo: pageParam,
					phone:phone,
					stamp:'',
					verify_code: '',
					invite_code: '',
				},
				methods: {
					clearMessage: function() {

					},
					scanner:function(){
					FNScanner = api.require('FNScanner');
					FNScanner.open({
							autorotation: true
					}, function(ret, err) {
							if (ret) {
								url = ret.content;

								if(url){
									var code = getUrlKey('inviteCode',url);
									vm.invite_code = code;
								}
							} else {
									alert(JSON.stringify(err));
							}
					});
				},
					codeMessage: function (message) {
						this.warn_box = true
						this.warn_title1 = '请输入正确的手机号'
					},
					pwdlogin: function () {
						openWin('../login/pwdLogin', { phone: vm.phone });
						vm.clearMessage()
					},
					userAgreement: function () {
						var url = this.wap_url + 'home/agreement';
						openWin('../home/browser', { url: url });
					},
					registerPhone: function () {
						var data = {
							smsVerification: this.verify_code,
							phone: this.phone,
							inviteCode: this.invite_code,
							timeStamp:1577330393
							// timeStamp:getPrefs('timeStamp'),
						}
						var callback = function (ret) {
							api.toast({
							    msg: '注册成功，即将跳转登陆',
							    duration: 2000,
							    location: 'bottom'
							});
							setTimeout(function (){closeWin()},"1000");

						};
						var errback = function (err) {
							alert(err.message)
						}
						pinet.post(APIURLP+'/play/register/phoneRegister', data, callback, errback);
					},
					tologin:function(){
						closeWin()
					},
					login_init: function (user) {
						setPrefs('user', user);
						setPrefs('token', user.token);
						setPrefs('username', user.nickname);
						setPrefs('portrait', user.memberAdd);
						setPrefs('member_id', user.memberId);
						api.openWin({
						    name: 'index',
						    url: '../../index.html',
								reload:true
						});

					},
				},
				watch: {

				}
			})
		}
		function addListeners() {
			// api.addEventListener({
			// 	name: 'viewdisappear'
			// }, function (ret, err) {
			// 	closeWin('setInfo');
			// });
		}

	</script>
</body>

</html>
